import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../../common_ui/back_nav.dart';
import '../../common_ui/confirm_btn.dart';
import '../../const/common_const.dart';
import '../../style/box_style.dart';
import '../../style/color_style.dart';
import '../../style/edgeInsets_style.dart';
import '../../style/radius_style.dart';
import '../controller/change_password_controller.dart';

class ChangePasswordPage extends StatelessWidget {
  const ChangePasswordPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: BackNavigation(
          backGroundColor: ColorStyle.whiteColor,
          title: LoginStringConst.changePasswordText,
        ),
        backgroundColor: ColorStyle.whiteColor,
        body: GestureDetector(
            behavior: HitTestBehavior.translucent,
            onTap: () {
              // 点击空白区域时收起键盘
              FocusScope.of(context).unfocus();
            },
            child: GetBuilder<ChangePasswordController>(
              init: ChangePasswordController(),
              builder: (controller) {
                return CustomScrollView(slivers: [
                  // 输入框
                  inputWidget(controller),
                  loginBtnWidget(controller, context),
                ]);
              },
            )));
  }

  Widget inputWidget(ChangePasswordController controller) {
    return SliverToBoxAdapter(
        child: Container(
            decoration: BoxDecoration(
              borderRadius: RadiusStyle.radiusAll(14),
              color: ColorStyle.whiteColor,
            ),
            margin: EdgeInsetsStyle.customMargin(20, 20, 20, 0),
            padding: EdgeInsetsStyle.customMargin(30, 10, 20, 50),
            child: Column(
              children: [
                // 新密码
                Container(
                  height: 44.h,
                  padding: EdgeInsetsStyle.edgeInsets(20, 0),
                  decoration: BoxDecoration(
                      borderRadius: RadiusStyle.radiusAll(25),
                      color: const Color(0xFFF5F7F7)),
                  child: Row(children: [
                    Expanded(
                        child: TextField(
                      controller: controller.newController,
                      textInputAction: TextInputAction.done,
                      onChanged: (txt) {
                        controller.changeBtnStatus();
                      },
                      decoration: const InputDecoration(
                        hintText: LoginStringConst.inputNewPassWordText,
                        border: InputBorder.none,
                      ),
                    ))
                  ]),
                ),
                Box.vBox30,
                // 密码
                Container(
                  height: 44.h,
                  padding: EdgeInsetsStyle.edgeInsets(20, 0),
                  decoration: BoxDecoration(
                      borderRadius: RadiusStyle.radiusAll(25),
                      color: const Color(0xFFF5F7F7)),
                  child: Row(children: [
                    Expanded(
                        child: TextField(
                      controller: controller.confirmController,
                      textInputAction: TextInputAction.done,
                      onChanged: (txt) {
                        controller.changeBtnStatus();
                      },
                      decoration: const InputDecoration(
                        hintText: LoginStringConst.confirmNewPassWordText,
                        border: InputBorder.none,
                      ),
                    ))
                  ]),
                ),
                Box.vBox30,
                const Text(
                  '温馨提示：设置的密码不低于6位数，必须含有数字和字母',
                  style: TextStyle(fontSize: 12, color: Color(0XFFD82F2F)),
                )
              ],
            )));
  }

  Widget loginBtnWidget(
      ChangePasswordController controller, BuildContext context) {
    return SliverToBoxAdapter(
        child: Container(
            padding: EdgeInsetsStyle.only(left: 40, right: 40),
            margin: EdgeInsetsStyle.customMargin(20, 60, 20, 0),
            child: ConfirmButton(
              titleColor: ColorStyle.whiteColor,
              backGroundColor: controller.canSubmit
                  ? ColorStyle.themeColor
                  : ColorStyle.colorCCCCCC,
              title: LoginStringConst.confirmChangeText,
              callBack: () {
                controller.submitClick(context);
              },
            )));
  }
}
